<!-- 智能派车列表 -->
<template>
  <el-dialog 
    v-el-drag-dialog="{drag: true, full: true, resize: false}"
    :visible="true"
    :close-on-click-modal="false"
    :append-to-body="true"
    @close="closeMd"
    width="1200px"
    title="智能派车列表"
    custom-class="zn-dis-car-list-md">
    <el-table
        :ref="dg.tbName"
        :data="dg.list"
        v-loading="dg.loading"
        border fit
        :height="350"
        :max-height="600"
        @selection-change="selZnRowChange($event, 1)"
        style="width: 100%;margin-bottom: 20px;">
        <template slot="empty">
            <span class="c-green" v-if="dg.dgListTip">提示：{{dg.dgListTip}}</span>
            <span v-else class="c-green">未查询到可套车辆</span>
        </template>

        <el-table-column 
            type="selection" 
            width="40">
        </el-table-column>
        <el-table-column
            prop="plateNum"
            label="车牌号"
            :resizable="false"
            align="center"
            width="90">
            <template slot-scope="{row}">
                <b>{{row.plateNum}}/{{row.seats}}</b>
                <el-button type="primary" size="mini" @click.native="onlineDisCar(row)">派车</el-button>
            </template>
        </el-table-column>

        <el-table-column
            prop="driverInfo"
            label="驾驶员"
            width="60">
            <template slot-scope="{row}">
                <template v-if="row.driverInfo">{{row.driverInfo.split(',')[0]}}</template>
            </template>
        </el-table-column>

        <el-table-column
            prop="stayStation"
            label="停靠点"
            width="70">
            <template slot-scope="props">{{props.row.stayStation}}</template>
        </el-table-column>

        <el-table-column
            prop="lastPosition"
            label="上一单行程">
            <template slot-scope="{row}">{{row.lastPosition}}</template>
        </el-table-column>
        
        <el-table-column
            prop="fastTime"
            label="最快到达"
            :resizable="false"
            align="center"
            width="70">
            <template slot-scope="props">{{props.row.fastTime}}</template>
        </el-table-column>

        <el-table-column
            prop="restTime"
            label="闲时最短"
            :resizable="false"
            align="center"
            width="70">
            <template slot-scope="{row}">
                <span :class="{'c-red': row.restTime.indexOf('-') != -1}">{{row.restTime}}</span>
            </template>
        </el-table-column>

        <el-table-column
            prop="distance"
            label="空驶最短"
            :resizable="false"
            width="70">
            <template slot-scope="props">{{props.row.distance}}</template>
        </el-table-column>

        <el-table-column
            prop="outDay"
            label="天数最少"
            :resizable="false"
            align="center"
            width="70">
            <template slot-scope="props">{{props.row.outDay}}</template>
        </el-table-column>
    </el-table>

    <SelectDisCars
        v-if="selectDisCarsMd.state"
        :myData="selectDisCarsMd"
        @myClick="setSelectDisCarsMd"
        @reloadDg="getDgList"
    />
 </el-dialog>
</template>

<script>
import elDragDialog from '@/directive/el-drag-dialog';
import DataGridBase from '@/views/mixins/DataGridBase';

import SelectDisCars from './select-dis-cars.vue'

import * as orderService from '@/api/services/order.service';

export default {
  name: 'DisCar',
  mixins: [ DataGridBase ],
  directives: { elDragDialog },
  props: { myData: Object },
  components: { SelectDisCars },
  data() {
    return {
        // 智能匹配派车列表参数对象
        dg: {
            tbName: 'znDisCarListTb',
            // 搜索按钮对象
            sb: {load: false},
            list: [],
            loading: false,
            dgListTip: '',
            ps: { // 过滤参数
                page: 1, rows: 100,
            },
        },

        // 选择派单车辆弹框
        selectDisCarsMd: {state: false},
        
    }
  },
  created(){
    console.log('父组件传入的数据', this.myData);
    const that = this;

    that.findDgList();
    
  },
  methods:{
    closeMd(){ // 关闭弹框
        this.$emit('myClick', {state: false});
    },
    
    // 查询-车辆列表
    findDgList(){
        let that = this, U = that.U, dg = that.xsdg, ps = that.xsdg.ps;

        let ktps = U.scopy(ps);
        // 可套车辆
        ktps.searchModel = 1;
        // 处理订单号，获取第一个就可以了
        ktps.sendOrderNum = ps.sendOrderNum[0];
        // 处理座位数参数 多个逗号拼接
        ktps.seats = ps.seats.join(','); 
        // 处理车牌
        ktps.plateNum = ps.plateNum.join(','); 
        
        dg.kt.loading = true, dg.kt.sb.load = true;
        orderService.getCarList(ktps).then(res => {
            if(!res){
                U.qerror('数据请求失败');
            }else if(res.code != 1){
                dg.kt.list = [];
            }else{
                dg.kt.list = res.data;
            }
        }).finally(() => { 
            dg.kt.loading = false;
            dg.kt.sb.load = false;
        });
    },
    

  }

 }
</script>

<style lang="less" scoped>

</style>